<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>时间</title>
  <link rel="stylesheet" href="./css/date.css">
  <link rel="stylesheet" href="./css/iconfont/iconfont.css">
</head>

<body>
  <!-- 时间组件容器 -->
  <div id="date">
    <div class="dateBox">
      <!-- 左边日期 -->
      <div class="date left">
        <!-- 具体日期 -->
        <div class="adkDate-hd">
          <span class="arrow icon iconfont icon-shanggeyue" id="prevMonth"></span>
          <div class="today">2023-05</div>
        </div>
        <!-- 星期 -->
        <ul class="week-ul ul-box">
          <li>日</li>
          <li>一</li>
          <li>二</li>
          <li>三</li>
          <li>四</li>
          <li>五</li>
          <li>六</li>
        </ul>
        <ul class="adkDate-bd ul-box now-month">
        </ul>
      </div>
      <div class="date right">
        <div class="adkDate-hd">
          <div class="today">2023-06</div>
          <span class="arrow icon iconfont icon-xiageyue" id="nextMonth"></span>
        </div>
        <ul class="week-ul ul-box">
          <li>日</li>
          <li>一</li>
          <li>二</li>
          <li>三</li>
          <li>四</li>
          <li>五</li>
          <li>六</li>
        </ul>
        <ul class="adkDate-bd ul-box next-month">
        </ul>
      </div>
    </div>
  </div>
  <script type="module">
    import DatePicker from './date.js';
    // 实例化 日期选择器 类
    let c = new DatePicker({
      el: '#date', // 传入容器的选择器  必填
      date: '2033-05-03',// 传入某天日期---表示当天, 选填
      clickCb(start, end) {// 点击日期的回调函数   选填
        // 开始日期---->结束日期
        console.log(start, end)
      }
    })

    // 请实现./date.js文件中的  DatePicker 类
    // 考试提交: 上传至个人gitee仓库并公开, 给我发送gitee仓库地址就行
  </script>

</body>

</html>